import React from 'react'
import { connect } from 'dva'
import { Form ,Modal,message,Upload,Button,Tabs,Row ,Col,Select,Input,Radio } from 'antd'
import { Link, hashHistory } from 'dva/router'
import config from 'config/config'
import FlagBtn from 'widget/FlagBtn/FlagView'
import { mapStateToProps } from 'utils/view_utils'
import styles from './configurationCenterStyle.less'
import ListPage from 'widget/PageTmpl/ListPage'
import classnames from 'classnames/bind';
import Uploader from 'widget/Upload'

import moment from 'moment'
let cx=classnames.bind(styles);
const confirm = Modal.confirm;
const { TabPane } = Tabs;
const { TextArea } = Input;
const FormItem = Form.Item
const formItemLayoutPro = {
    labelCol: { span: 6 },
    wrapperCol: { span: 14 },
  };
function timestampToTime(timestamp) {
  var date = new Date(timestamp);//时间戳为10位需*1000，时间戳为13位的话不需乘1000
  var Y = date.getFullYear() + '-';
  var M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '-';
  var D = (date.getDate() < 10 ? '0'+date.getDate() : date.getDate()) + ' ';
  var h = (date.getHours() < 10 ? '0'+date.getHours() : date.getHours()) + ':';
  var m = (date.getMinutes() < 10 ? '0'+date.getMinutes() : date.getMinutes()) + ':';
  var s = (date.getSeconds() < 10 ? '0'+date.getSeconds() : date.getSeconds());
    return Y+M+D+h+m+s;
}

const configurationCenterView = function({dispatch, model, form}) {
  // 表单的子函数
  const {resetFields, getFieldDecorator, validateFields, setFieldsValue,validateFieldsAndScroll} = form
  // 取出model对象，命名空间
  const { modelObj, namespace } = model
  // modelObj.xxx获取model中状态机的值
  let {graphicModal,graphicData,products,areaList,tabsType,biz,biz1,biz2,biz3,id,customerLabelModal,zituoQuery,talkWayModal,labelQuery,otherQuery} = modelObj
  let pageProps = { //拓客学堂配置
    // ---------- 界面部分 ----------
    ui: {
      // 页面接口地址
      api_url: `zituo-admin/a/study/findStudyMoudleList`,
      // 接口方式
      method: "POST",
      app: "",
      // 接口参数
      params: {
        pageSize:10,
        pageNo:1,
        // projectId: 'B38F5F2F-D935-4F87-A016-07E7DDE86266',
        },
      // 模拟数据 - 用于开发需要，若填充了上面的api_url之后，请将此项设置为null
      // "mockData": mockData,
      mockData: null,
      // 查询栏
      search_bar: {
        fields: [
          {
            en_name: 'moudleName',
            zh_name: '学堂模块名称',
            elem_type: 'Input',
            elem_valid_type: 'string',
          },
          {
            en_name: 'tableType',
            zh_name: '使用系统',
            elem_type: 'Select',
            elem_valid_type: 'string',
            cmpt_items: [
              {
                  value: '0',
                  label: '智行销'
               }, 
              {
                  value: '1',
                  label: '慧客通'
              }
          ],
          },
        ],
        searchHandler: () => { // 自定义搜索按钮回调函数，点击搜索时触发
          console.log('search click')
        },
        resetHandler: () => { // 自定义重置按钮回调函数，点击重置时触发
          console.log('reset click')
        },
        searchCallback: params => { // 自定义搜索完成后的后调函数, 搜索完成后触发, 并将本次搜索的参数传入
          console.log('search finish', params)
        },
        pasteTargetList: [  // 列表组件中将输入框的en_name作为默认id(也可以通过id另外设置)
          'channel',  // 将需要粘贴事件拦截的输入框id以数组的形式传入, 该参数对应PasteFromClipboard组件的targetList参数
        ]
      },
      // 数据表格  序号 是否生效 项目名称  佣金方案名称 方案生效日期 方案失效日期 审批人 审批通过日期   提交人 提交日期  创建人 创建日期
      table:
        {
          status_params: "status=0",
          status_text: "全部",
          // 表头字段列表
          scroll: { x: 1600},
          fields: [
            {
              en_name: "ruleNo",
              zh_name: "编号",
              width: 60,
              render: (a, item, index, d, e, f) => {
                return index+1
              },
            },
            {
              en_name: "moudleName",
              zh_name: "学堂模块名称",
            },
            {
              en_name: "updateDate",
              zh_name: "操作时间",
              render:(a, item, index, d, e, f)=>{
                if(item.updateDate){
                  return timestampToTime(item.updateDate)
                }else{
                  return ''
                }
              }
            },
            {
              en_name: "tableType",
              zh_name: "使用系统",
              render:(a, item, index, d, e, f)=>{
                if(item.tableType == '0'){
                  return '智行销'
                }
                if(item.tableType == '1'){
                  return '慧客通'
                }
              }
            },
            {
              en_name: "operater",
              zh_name: "操作人",
            },
            {
              en_name: "ifUse",
              zh_name: "状态",
              render:(a, item, index, d, e, f)=>{
                if(item.ifUse == 'N'){
                  return '禁用'
                }else if(item.ifUse == 'Y'){
                  return '启用'
                }
              }
            },
            {
              en_name: "edit",
              zh_name: "操作",
              width:160,
              fixed:'right',
              render: (a, item, index, d, e, f) => {
                return (
                  <span>
                      <FlagBtn node={<a onClick={() => moveUpStu(item,'拓客学堂')}>上移<span className="ant-divider" /></a>} btnId={''}> </FlagBtn>
                      <FlagBtn node={<a onClick={() => updateCustomerLabelCancel(item)}>修改<span className="ant-divider" /></a>} btnId={''}> </FlagBtn>
                      <FlagBtn node={<a onClick={() => onToggleStatus(item,'拓客学堂')}>{item.ifUse == 'N' ? '启用' : '禁用'}</a>} btnId={''}> </FlagBtn>
                  </span>
                )
              },
            }
          ],
        },
      // 操作栏
      action_bar: [
      ],
    },
  }
  let pageProps1 = { //拓客方式配置
    // ---------- 界面部分 ----------
    ui: {
      // 页面接口地址
      api_url: `zituo-admin/a/configuration/zituoMethod/`,
      // 接口方式
      method: "GET",
      // "data_field_name":"data",
      app: "",
      // 接口参数
      params: {
        pageSize:'10',
        pageNo:'1',
        channel: '行销自拓' 
        },
      // 模拟数据 - 用于开发需要，若填充了上面的api_url之后，请将此项设置为null
      // "mockData": mockData,
      mockData: null,
      // 查询栏
      search_bar: {
        fields: [
          {
            en_name: 'methodName',
            zh_name: '拓客方式',
            elem_type: 'Input',
            elem_valid_type: 'string',
          }
        ],
        searchHandler: () => { // 自定义搜索按钮回调函数，点击搜索时触发
          console.log('search click')
        },
        resetHandler: () => { // 自定义重置按钮回调函数，点击重置时触发
          console.log('reset click')
        },
        searchCallback: params => { // 自定义搜索完成后的后调函数, 搜索完成后触发, 并将本次搜索的参数传入
          console.log('search finish', params)
        },
        pasteTargetList: [  // 列表组件中将输入框的en_name作为默认id(也可以通过id另外设置)
          'channel',  // 将需要粘贴事件拦截的输入框id以数组的形式传入, 该参数对应PasteFromClipboard组件的targetList参数
        ]
      },
      // 数据表格  序号 是否生效 项目名称  佣金方案名称 方案生效日期 方案失效日期 审批人 审批通过日期   提交人 提交日期  创建人 创建日期
      table:
        {
          status_params: "status=0",
          status_text: "全部",
          // 表头字段列表
          scroll: { x: 1000},
          fields: [
            {
              en_name: "ruleNo",
              zh_name: "编号",
              width: 60,
              render: (a, item, index, d, e, f) => {
                return index+1
              },
            },
            {
              en_name: "methodName",
              zh_name: "拓客方式",
            },
            {
              en_name: "createDate",
              zh_name: "操作时间",
              render:(a, item, index, d, e, f)=>{
                if(item.createDate){
                  return timestampToTime(item.createDate)
                }else{
                  return ''
                }
              }
            },
            {
              en_name: "userName",
              zh_name: "操作人",
            },
            {
              en_name: "edit",
              zh_name: "操作",
              width:110,
              fixed:'right',
              render: (a, item, index, d, e, f) => {
                return (
                  <span>
                      <FlagBtn node={<a onClick={() => moveUp(item,'拓客方式')}>上移<span className="ant-divider" /></a>} btnId={''}> </FlagBtn>
                      <FlagBtn node={<a onClick={() => updateTalkWayCancel(item)}>修改<span className="ant-divider" /></a>} btnId={''}> </FlagBtn>
                      <FlagBtn node={<a onClick={() => deleteContent(item,'拓客方式')}>删除</a>} btnId={''}> </FlagBtn>
                  </span>
                )
              },
            }
          ],
        },
      // 操作栏
      action_bar: []
    },
  }
  let pageProps2 = { //参数配置
    // ---------- 界面部分 ----------
    ui: {
      // 页面接口地址
      api_url: `zituo-admin/a/configuration/zituoSetting/`,
      // 接口方式
      method: "GET",
      // "data_field_name":"data",
      app: "",
      // 接口参数
      params: {
        pageSize:'10',
        pageNo:'1',
        areaId:otherQuery.areaId && otherQuery.areaId != ""?otherQuery.areaId:"",
        projectId:otherQuery.projectId && otherQuery.projectId != ""?otherQuery.projectId:"",
        channel: '行销自拓'
        },
      // 模拟数据 - 用于开发需要，若填充了上面的api_url之后，请将此项设置为null
      // "mockData": mockData,
      mockData: null,
      // 查询栏
      search_bar: {
        fields: [
          {
            en_name: 'areaId',
            zh_name: '区域',
            elem_type: 'Select',
            elem_valid_type: 'string',
            cmpt_items: areaList
          },
          {
            en_name: 'projectId',
            zh_name: '项目',
            elem_type: 'SelectFilter',
            elem_valid_type: 'string',
            showSearch: true,
            cmpt_items: products,
            onFocus:()=>{
              if(biz2.queryForm && biz2.queryForm.areaId){ 
                filterProjectList(biz2.queryForm.areaId)
              }
            },
          }
        ],
        searchHandler: () => { // 自定义搜索按钮回调函数，点击搜索时触发
          console.log('search click')
        },
        resetHandler: () => { // 自定义重置按钮回调函数，点击重置时触发
          console.log('reset click')
        },
        searchCallback: params => { // 自定义搜索完成后的后调函数, 搜索完成后触发, 并将本次搜索的参数传入
          console.log('search finish', params)
        },
        pasteTargetList: [  // 列表组件中将输入框的en_name作为默认id(也可以通过id另外设置)
          'channel',  // 将需要粘贴事件拦截的输入框id以数组的形式传入, 该参数对应PasteFromClipboard组件的targetList参数
        ]
      },
      // 数据表格  序号 是否生效 项目名称  佣金方案名称 方案生效日期 方案失效日期 审批人 审批通过日期   提交人 提交日期  创建人 创建日期
      table:
        {
          status_params: "status=0",
          status_text: "全部",
          // 表头字段列表
          scroll: { x: 1800},
          fields: [
            {
              en_name: "ruleNo",
              zh_name: "编号",
              width: 60,
              render: (a, item, index, d, e, f) => {
                return index+1
              },
            },
            {
              en_name: "areaName",
              zh_name: "区域",
              width: 260,
            },
            {
              en_name: "projectName",
              zh_name: "项目",
              width: 260,
            },
            {
              en_name: "phoneAuthority",
              zh_name: "渠道经理查看客户全号",
              render: (a, item, index, d, e, f) => {
                if(item.phoneAuthority == '0'){
                  return '不允许'
                }else if(item.phoneAuthority == '1'){
                  return '允许'
                }else{
                  return ''
                }
              },
            },
            {
              en_name: "isAllowsSpecify",
              zh_name: "指定置业顾问",
              render: (a, item, index, d, e, f) => {
                if(item.isAllowsSpecify == '0'){
                  return '不允许'
                }else if(item.isAllowsSpecify == '1'){
                  return '允许'
                }else{
                  return ''
                }
              },
            },
            {
              en_name: "ifAllowCrossProject",
              zh_name: "报备业主（其他项目）",
              render: (a, item, index, d, e, f) => {
                if(item.ifAllowCrossProject == '0'){
                  return '不允许'
                }else if(item.ifAllowCrossProject == '1'){
                  return '允许'
                }else{
                  return ''
                }
              },
            },
            {
              en_name: "callbackShortTime",
              zh_name: "报备到访最短有效时间(小时)",
              render: (a, item, index, d, e, f) => {
                return item.callbackShortTime
              },
            },
            {
              en_name: "callbackLongTime",
              zh_name: "报备到访最长有效时间(小时)",
              render: (a, item, index, d, e, f) => {
                return item.callbackLongTime
              },
            },
            {
              en_name: "type",
              zh_name: "考勤规则",
              render: (a, item, index, d, e, f) => {
                if(item.type == '0'){
                  return '一天一班'
                }else if(item.type == '1'){
                  return '一天两班'
                }else{
                  return ''
                }
              },
            },
            {
              en_name: "edit",
              zh_name: "操作",
              width:110,
              fixed:'right',
              render: (a, item, index, d, e, f) => {
                return (
                  <span>
                      <FlagBtn node={<a onClick={() => checkOrEditSkip('detail',item)}>修改<span className="ant-divider" /></a>} btnId={''}> </FlagBtn>
                      <FlagBtn node={<a onClick={() => deleteContent(item,'参数配置')}>删除</a>} btnId={''}> </FlagBtn>
                  </span>
                )
              },
            }
          ],
        },
      // 操作栏
      action_bar: []
    },
  }
  let pageProps3 = { //激励图文配置
    // ---------- 界面部分 ----------
    ui: {
      // 页面接口地址
      api_url: `zituo-admin/a/configuration/photo/list`,
      // 接口方式
      method: "GET",
      app: "",
      // 接口参数
      params: {
        pageSize:'10',
        pageNo:'1',
        },
      // 模拟数据 - 用于开发需要，若填充了上面的api_url之后，请将此项设置为null
      // "mockData": mockData,
      mockData: null,
      // 查询栏
      search_bar: {
        fields: [
          {
            en_name: 'type',
            zh_name: '类型',
            elem_type: 'Select',
            elem_valid_type: 'string',
            cmpt_items: [
              {
                  value: '1',
                  label: '图片'
              },
              {
                  value: '2',
                  label: '文字'
            }
            ],
          }
        ],
        searchHandler: () => { // 自定义搜索按钮回调函数，点击搜索时触发
          console.log('search click')
        },
        resetHandler: () => { // 自定义重置按钮回调函数，点击重置时触发
          console.log('reset click')
        },
        searchCallback: params => { // 自定义搜索完成后的后调函数, 搜索完成后触发, 并将本次搜索的参数传入
          console.log('search finish', params)
        },
        pasteTargetList: [  // 列表组件中将输入框的en_name作为默认id(也可以通过id另外设置)
          'channel',  // 将需要粘贴事件拦截的输入框id以数组的形式传入, 该参数对应PasteFromClipboard组件的targetList参数
        ]
      },
      // 数据表格  序号 是否生效 项目名称  佣金方案名称 方案生效日期 方案失效日期 审批人 审批通过日期   提交人 提交日期  创建人 创建日期
      table:
        {
          status_params: "status=0",
          status_text: "全部",
          // 表头字段列表
          scroll: { x: 1000},
          fields: [
            {
              en_name: "ruleNo",
              zh_name: "编号",
              width: 60,
              render: (a, item, index, d, e, f) => {
                return index+1
              },
            },
            {
              en_name: "content",
              zh_name: "类型",
              render:(a, item, index, d, e, f)=>{
                if(item.type == '1'){
                  return <img style={{width:'80px',height:'50px'}} src={item.content}></img>
                }else{
                  return item.content || ''
                }
              }
            },
            {
              en_name: "createUser",
              zh_name: "创建人",
            },
            {
              en_name: "createTime",
              zh_name: "创建时间",
              render:(a, item, index, d, e, f)=>{
                if(item.createTime){
                  return timestampToTime(item.createTime)
                }else{
                  return ''
                }
              }
            },
            {
              en_name: "edit",
              zh_name: "操作",
              width:110,
              fixed:'right',
              render: (a, item, index, d, e, f) => {
                return (
                  <span>
                      <FlagBtn node={<a onClick={() => deleteContent(item,'激励图文')}>删除</a>} btnId={''}> </FlagBtn>
                  </span>
                )
              },
            }
          ],
        },
      // 操作栏
      action_bar: []
    },
  }
  //编辑
  function checkOrEditSkip(type,item){
      hashHistory.push({
        pathname: '/home/expandManage/otherConfigAdd',
        query: {actionType: type, id:item.id }
      })
  }
  //禁用 启用
  function onToggleStatus(item,type){
    let ifUse = 'N';
    item.ifUse=='Y'?ifUse='N':ifUse='Y'
    dispatch({
        type: `${namespace}/changeStatus`,
        payload: {
            params: { id: item.id, ifUse: ifUse },
            type: type
        }
    })
  }
  //上移
  function moveUp(item){
    dispatch({
      type: `${namespace}/updateSort`,
      payload: {
          params: item,
      }
  })
  }
  //学堂上移
  function moveUpStu(item){
    dispatch({
      type: `${namespace}/changeModuleOrder`,
      payload: {params: item}
  })
  }

  //过滤项目数据
  function filterProjectList(areaId){
    products = []
    let list = []
    for(var item of areaList){
      if(item.value == areaId){
        list = item.children
      }
    }
    if(list.length){
      products =  list.map((item,index)=>{
        return {
          label: item.buname,
          value: item.buguid,
        }
      })
    }
    dispatch({
      type: `${namespace}/updateStore`,
      payload: {products}
    })
  }
  // 跳转其他配置
  function goOtherConfigAdd(){
    hashHistory.push({
      pathname: '/home/expandManage/otherConfigAdd',
      query: {}
    });
  }

  //删除
  function deleteContent(item,type){
      // id = item.id
      confirm({
        title: '删除确认',
        content: '您真的要删除此条信息吗?',
        okText: '确认',
        okType: 'primary',
        cancelText: '取消',
        onOk() {
          baseFun(item,type)
        },
        onCancel() {
          console.log('Cancel');
        },
      });
  }

    //学堂弹窗改变时
  function inputChange (value, name) {
      let obj = {[name]: value}
      labelQuery = Object.assign(labelQuery, obj)
      dispatch({
        type: `${namespace}/updateStore`,
        payload: {labelQuery}
      })
  }
  
  //拓客方式弹窗改变时
  function inputZituoChange (value, name) {
    let obj = {[name]: value}
    zituoQuery = Object.assign(zituoQuery, obj)
    dispatch({
      type: `${namespace}/updateStore`,
      payload: {zituoQuery}
    })
  }

  //激励图文改变时
  function inputGraphicChange (value, name) {
    let obj = {[name]: value}
    graphicData = Object.assign(graphicData, obj)
    dispatch({
      type: `${namespace}/updateStore`,
      payload: {graphicData}
    })
  }

  //切换tabs
  function tabsChange(key) {
    tabsType = key
    dispatch({
        type: `${namespace}/updateStore`,
        payload: { tabsType }
    })
  }

//   新增学堂弹窗
  function updateCustomerLabelCancel(item){
    if(item){
        labelQuery.id = item.id
        labelQuery.moudleName = item.moudleName
        labelQuery.tableType = item.tableType
    }else{
        labelQuery.id = ''
        labelQuery.moudleName = ''
        labelQuery.tableType = ''
    }
    customerLabelModal.visible = !customerLabelModal.visible
    form.resetFields()
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { customerLabelModal,labelQuery }
    })
  }
  function onCustomerLabelSubmit(){
    validateFieldsAndScroll((err) => {
      if (err) {
        return false
      } else {
        dispatch({
          type: `${namespace}/submit`,
          payload: {type: '拓客学堂'}
        })
      }
    })
  }

  //新增拓客方式弹窗
  function updateTalkWayCancel(item){
    if(item){
      zituoQuery.id = item.id
      zituoQuery.methodName = item.methodName
    }else{
      zituoQuery.id = ''
      zituoQuery.methodName = ''
    }
    talkWayModal.visible = !talkWayModal.visible
    form.resetFields()
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { talkWayModal,zituoQuery}
    })
  }
  function onTalkWaySubmit(){
    validateFieldsAndScroll((err) => {
      if (err) {
        return false
      } else {
        dispatch({
          type: `${namespace}/submit`,
          payload: {type: '拓客方式'}
        })
      }
    })
  }

  //激励图文
  function updateGraphicCancel(){
    graphicData.type = '2'
    graphicData.slideUrl = ''
    graphicData.text = ''

    graphicModal.visible = !graphicModal.visible
    form.resetFields()
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { graphicModal,graphicData}
    })
  }
  function onGraphicSubmit(){
    validateFieldsAndScroll((err) => {
      if (err) {
        return false
      } else {
        dispatch({
          type: `${namespace}/submit`,
          payload: {type: '激励图文'}
        })
      }
    })
  }

  //上传图片
  function updateImageModel(value) {
    graphicData.slideUrl = value
    dispatch({
        type: `${namespace}/updateStore`,
        payload: { graphicData }
    });
  };
  //删除上传的图片
  function removeImgUrl() {
      graphicData.slideUrl = ''
      dispatch({
          type: `${namespace}/updateStore`,
          payload: { graphicData}
      });
  }


  function baseFun(item,type){
    dispatch({
      type: `${namespace}/deleteContent`,
      payload: {params:item,type:type}
    })
  }
  if (!!modelObj.biz) {
    pageProps.biz = modelObj.biz
		pageProps.biz.syncBackCbf = (biz) => {
			dispatch({
				type: `${namespace}/updateStore`,
				payload: { biz:biz }
			})
		}
  }
  if (!!modelObj.biz1) {
    pageProps1.biz = modelObj.biz1
    pageProps1.biz.syncBackCbf = (biz) => {
      dispatch({
        type: `${namespace}/updateStore`,
        payload: { biz1:biz }
      })
    }
  }
  if (!!modelObj.biz2) {
    pageProps2.biz = modelObj.biz2
    pageProps2.biz.syncBackCbf = (biz) => {
      dispatch({
        type: `${namespace}/updateStore`,
        payload: { biz2:biz }
      })
    }
  }
  if (!!modelObj.biz3) {
    pageProps3.biz = modelObj.biz3
    pageProps3.biz.syncBackCbf = (biz) => {
      dispatch({
        type: `${namespace}/updateStore`,
        payload: { biz3:biz }
      })
    }
  }

  return (
    <div className='public_listMain'>
        <div className={"functionButton"}>
            <FlagBtn node={<Button style={{display: tabsType=='1'?"inline-block": 'none'}} type='primary' onClick={e => goOtherConfigAdd()}>新增</Button>} btnId={'10601'}> </FlagBtn>
            <FlagBtn node={<Button style={{display: tabsType=='2'?"inline-block": 'none'}} type='primary' onClick={e => updateTalkWayCancel()}>新增</Button>} btnId={'10602'}> </FlagBtn>
            <FlagBtn node={<Button style={{display: tabsType=='3'?"inline-block": 'none'}} type='primary' onClick={e => updateCustomerLabelCancel()}>新增</Button>} btnId={'10603'}> </FlagBtn>
            <FlagBtn node={<Button style={{display: tabsType=='4'?"inline-block": 'none'}} type='primary' onClick={e => updateGraphicCancel()}>新增</Button>} btnId={'10604'}> </FlagBtn>
        </div>
        {tabsType&& <Tabs  onChange={tabsChange} animated={false} activeKey={tabsType} className='configuration-center-tabs'>
            <TabPane tab="参数配置" key="1">
                <ListPage pageProps={pageProps2}/>
            </TabPane>
            <TabPane tab="拓客方式配置" key="2">
                <ListPage pageProps={pageProps1}/>
            </TabPane> 
            <TabPane tab="拓客学堂配置" key="3">
                <ListPage pageProps={pageProps}/>
            </TabPane>
            <TabPane tab="激励图文配置" key="4">
                <ListPage pageProps={pageProps3}/>
            </TabPane>
        </Tabs>}
        <Modal
            title="学堂模块"
            visible={customerLabelModal.visible}
            onOk={() => { onCustomerLabelSubmit() }}
            onCancel={() => { updateCustomerLabelCancel() }}
          >
          <Row>
            <Col span={24}>
              <FormItem label='使用系统'  {...formItemLayoutPro}>
                {getFieldDecorator('tableType', {
                  rules: [{
                    required: tabsType=='3'?true:false, whitespace: true, message: '请选择使用系统'
                  }],
                  initialValue: labelQuery.tableType
                })(
                  <Radio.Group name="tableType" onChange={(e) => { inputChange(e.target.value, 'tableType') }}>
                      <Radio value="0">智行销</Radio>
                      <Radio value='1'>慧客通</Radio>
                  </Radio.Group>
                )}
              </FormItem>
            </Col>
          </Row>
            <Row>
              <Col span={24}>
                <FormItem label='学堂模块名称'  {...formItemLayoutPro}>
                  {getFieldDecorator('moudleName', {
                    rules: [{
                      required: tabsType=='3'?true:false, whitespace: true, message: '请输入学堂模块名称'
                    }],
                    initialValue: labelQuery.moudleName
                  })(
                    <Input placeholder='请输入学堂模块名称' onChange={(e) => { inputChange(e.target.value, 'moudleName') }} />
                  )}
                </FormItem>
              </Col>
            </Row>
          </Modal>
          
        <Modal
          title="新增拓客方式"
          visible={talkWayModal.visible}
          onOk={() => { onTalkWaySubmit() }}
          onCancel={() => { updateTalkWayCancel() }}
        >
          <Row>
            <Col span={24}>
              <FormItem label='拓客方式名称'  {...formItemLayoutPro}>
                {getFieldDecorator('methodName', {
                  rules: [{
                    required: tabsType=='2'?true:false, whitespace: true, message: '请输入拓客方式名称'
                  }],
                  initialValue: zituoQuery.methodName
                })(
                  <Input placeholder='请输入拓客方式名称' onChange={(e) => { inputZituoChange(e.target.value, 'methodName') }} />
                )}
              </FormItem>
            </Col>
          </Row>
        </Modal>
        <Modal
          title="新增图文"
          visible={graphicModal.visible}
          width={800}
          onOk={() => { onGraphicSubmit() }}
          onCancel={() => { updateGraphicCancel() }}
        >
          <Row>
            <Col span={24}>
              <FormItem label='类型'  {...formItemLayoutPro}>
                {getFieldDecorator('type', {
                  rules: [{
                    required: false, whitespace: true, message: '请选择是否轮播'
                  }],
                  initialValue: graphicData.type
                })(
                  <Radio.Group name="type" onChange={(e) => { inputGraphicChange(e.target.value, 'type') }}>
                      <Radio value="2">文字</Radio>
                      <Radio value='1'>图片</Radio>
                  </Radio.Group>
                )}
              </FormItem>
            </Col>
          </Row>
          <Row style={{display: graphicData.type=='2'?'block':'none'}}>
            <Col span={24}>
              <FormItem label='内容'  {...formItemLayoutPro} extra="注：为方便阅读和分享传递正能量,激励内容字数控制在20个字以内。">
                {getFieldDecorator('text', {
                  rules: [{
                    required: false, whitespace: true, message: '请输入内容'
                  }],
                  initialValue: graphicData.text
                })(
                  <TextArea placeholder='请输入内容' maxLength={20} onChange={(e) => { inputGraphicChange(e.target.value, 'text') }}></TextArea>
                )}
              </FormItem>
            </Col>
          </Row>
          <Row style={{display: graphicData.type=='1'?'block':'none'}}>
            <FormItem  label='内容'
                {...formItemLayoutPro}
                extra="图片分辨率需为1372px*736px,且文件大小在500kb以下,支持jpg,png格式"
                // label=" "
                // required='true'
                >
                <Uploader uploadedUrls={graphicData.slideUrl}
                    removeFileCbf={() => { removeImgUrl() }}
                    uploadSuccessCbf={(slideUrl) => { updateImageModel(slideUrl) }}
                    showType={'6'}
                    minCropBoxWidth={1372}
                    minCropBoxHeight={736}
                    unsetWidth={true}
                    fileType='image'
                    fileMaxSize='0.5'
                    maxFiles='1'
                />
            </FormItem>
          </Row>
        </Modal>          
    </div>
  )
}
// 连接视图(view)和模型(model)
export default connect(mapStateToProps)(Form.create()(configurationCenterView))
